<meta name="_token" content="{{ csrf_token() }}"/>
<script src="{{ mix('js/app.js') }}"></script>

{{--示例1--}}
{{--<div id="app">--}}
{{--    @{{ message }}--}}
{{--</div>--}}

{{--示例2--}}
{{--<div id="app-2">--}}
{{--    <span v-bind:title="message">你好</span>--}}
{{--</div>--}}

{{--示例3--}}
{{--<div id="app-3">--}}
{{--    <p v-if="seen">是seen</p>--}}
{{--</div>--}}

{{--示例4--}}
{{--<div id="app-4">--}}
{{--    <ol>--}}
{{--        <li v-for="v in fordata">@{{v.name}}</li>--}}
{{--    </ol>--}}
{{--</div>--}}

{{--示例5--}}
{{--<div id="app-5">--}}
{{--    <p>@{{message}}</p>--}}
{{--    <button v-on:click="btn">点击按钮</button>--}}
{{--</div>--}}

{{--示例6--}}
{{--<div id="app-6">--}}
{{--    <p>@{{message}}</p>--}}
{{--    <input v-model="message">--}}
{{--</div>--}}

{{--组件1--}}
<div id="app-7">
    <ol>
        <todo-item v-for="todo in todos" v-bind:todo="todo"></todo-item>
    </ol>
</div>

<script>

    Vue.component('todo-item', {
        props: ['todo'],
        template: '<li>@{{ todo.text }}</li>'
    });

    var app7=new Vue({
        el:'#app-7',
        data:{
            todos:[
                {text:'反守为攻'},
                {text:'格式如果'},
                {text:'甘定干等人'},
            ]
        }
    });

    // 示例1
    // var app=new Vue({
    //    el:'#app',
    //    data:{
    //        message:'hello word!'
    //    }
    // });

    // 示例2
    // var app2=new Vue({
    //    el:'#app-2',
    //    data:{
    //        message:'现在时间'+new Date()
    //    }
    // });

    //示例3
    // var app3=new Vue({
    //    el:'#app-3',
    //    data:{
    //        seen:true
    //    }
    // });

    //示例4
    // var app4=new Vue({
    //     el:'#app-4',
    //     data:{
    //         fordata:[
    //             {name:'张三'},
    //             {name:'李四'},
    //             {name:'王五'},
    //             {name:'赵六'}
    //         ]
    //     }
    // });

    //示例5
    // var app5=new Vue({
    //     el:'#app-5',
    //     data:{
    //         message:'示例5'
    //     },
    //     methods:{
    //         btn:function(){
    //             this.message='修改了'
    //         }
    //     }
    // });

    //示例6
    // var app6=new Vue({
    //     el:'#app-6',
    //     data:{
    //         message:'示例6',
    //     }
    // })
</script>